<?php
include('../includes/img_process/getImgInfo.php');
include('../includes/db_exe/db_connection.php');
?>
<?php
	$title_page = 'Upload';
	include '../includes/html_templates/header.php';
	//lay gia tri get cua URL cua site de tim image
?>
<?php	
	if(isset($_GET['ws'])&&isset($_GET['is'])){
		$db_conn = connectDb();
		$q = "SELECT id_collection,collection_name FROM user_collections WHERE id_user_create = 1";
		$r = exeQuery($db_conn,$q);
		mysqli_close($db_conn);
		$listCollections = array();
		while($row = mysqli_fetch_array($r,MYSQLI_ASSOC)){
			$listCollections[] = $row; 
		}
?>
		<!-- hien hop thoai select cho cac collection -->
		<div id="outer" class="container"style="margin-top: 45px;">
			<div id="inner">
				<div id="product-add-form">
					<h1>Đăng sản phẩm</h1>
					<div>
						<form action='createPost.php' method='POST' accept-charset="UTF-8" id="upload_new_product">
							<input type="hidden" name="originalImgUrl" value="<?php echo $_GET['is'] ?>">
							<input type="hidden" name="productUrl" value="<?php echo $_GET['ws']?>">
							<input type="hidden" name="titleProduct" value="<?php echo $_GET['ti']?>">

							<div class="products-select-collection-container">
								<div class="product-select-collection">
									<input id="id_collection" name='selectedCollection' type="hidden" value="<?php echo $listCollections[0]['id_collection'];?>" >
									<input id="collection_is_new" name="collectionIsNew" type="hidden" value="false">

									<span class='title-input-upload-product'>Hãy chọn một bộ sưu tập của bạn để đăng sản phẩm này lên</span>
									<div class="products-selected-collection-container button">
										<span class='product-selected-collection-name'><?php echo $listCollections[0]['collection_name']?></span>
										<img src="#">
									</div>
									<div class="products-collection-dropdown">
										<div class="dropdown-menu" tabindex="-1">
											<div class="close-dropdown-menu">
												<span class="title-collection-dropmenu">Chọn một bộ sưu tập</span>
												<span class="close-popup-btn">X</span>
											</div>
											<ul class="products-collections">
												<?php
												foreach($listCollections as $collection){
													echo "<li data-id-collection='{$collection['id_collection']}'><a href='#'>{$collection['collection_name']}</a></li>";
												} 
												
												?>
											</ul>
											<div class="add-new-collection-container">
												
												<button class="add-new-collection-btn" type="button">Tạo mới</button>
												<div class="products-select-collection-add-collection-name-container">
													<input class="add-new-collection-name" maxlength="100" type="text" placeholder="Tên bộ sưu tập cần tạo">
												</div>
											</div>
										</div>
									</div>

									
								</div>
							</div>

							<!-- category cho san pham duoc upload -->
							<div class="category-product-upload-container">
								<!-- iput gia tri cho category ID -->
								<input type="hidden" name="categoryId" value="0">
								<span class="title-input-upload-product">Chọn một danh mục cho sản phẩm này</span>
								<div class="category-product-button">
					                <a href="#" class="category-product-selected">
					                    <span>Chọn danh mục</span>
					                    <img src="resources/images/arrow_down.png" style="margin-left:0;">
					                </a>
					                <span class="narrow-category-dropmenu"></span>
					               <div class="category-dropdown-menu" >
					                    <ul class="theme-category-dropdown-menu">
					                        
					                        <li class="each-category-drop-submenu">
					                            <span class="sub-title-dropdown-menu">Quần Áo</span>
					                            <ul>
					                                <li>
					                                    <a href="#" data-category-id='101'>Áo</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='102'>Áo thun</a>
					                                </li>
					                                <li>
					                                    <a href="#"data-category-id='103' >Áo sơ mi</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='104' >Áo khoác</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='105' >Quần</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='106'>Chân váy</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='107' >Đầm</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='108' >Đồ thể thao</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='109' >Đồ lót</a>
					                                </li>
					                            </ul>
					                        </li>
					                        <li class="each-category-drop-submenu">
					                            <span class="sub-title-dropdown-menu">Giày Dép</span>
					                            <ul>
					                                <li>
					                                    <a href="#" data-category-id='201' >Giày cao gót</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='202' >Giày búp bê</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='203' >Giày đế xuồng</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='204' >Giày tây</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='205' >Giày xăng đan</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='207' >Giày thể thao</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='208' >Giày bốt</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='209' >Giày mọi</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='210' >Giày nam</a>
					                                </li>
					                                <li>
					                                    <a href="#" data-category-id='211'>Guốc/Dép</a>
					                                </li>
					                                
					                            </ul>
					                        </li>
					                        <li class="each-category-drop-submenu">
					                            <span class="sub-title-dropdown-menu">Túi Xách</span>
					                            <ul>
					                            	<li>
					                                	<a href="#" data-category-id='301'>Túi xách</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='302'>Túi chéo</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='303' >Balo</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='304' >Bóp/Ví</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='305' >Vali</a>
					                                </li>
					                            </ul>
					                        </li>
					                        <li class="each-category-drop-submenu">
					                            <span class="sub-title-dropdown-menu">Phụ Kiện</span>
					                            <ul>
					                            	<li>
					                                	<a href="#" data-category-id='401' >Dây nit</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='402'>Kính mát</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='403' >Đồng hồ</a>
					                                </li>
					                                <li>
					                                	<a href="#" data-category-id='404' >Nón Mũ</a>
					                                </li>
					                            </ul>
					                        </li>
					                    </ul>
					               </div>
	           					</div>
           					</div>

								<!-- nhan gia tri selected cua collection user chon dua vao input -->
							<div class="price-product-upload">
								<span class='title-input-upload-product'>Nhập giá sản phẩm</span>
								<input class='price-upload-product-input' type="text" maxlength="11" name="priceProduct" value="" placeholder="000">
							</div>
							<div id="uploadGenderProduct">
								<input type="hidden" value="0" name="genderProduct">
								<span class='title-input-upload-product'>Sản phẩm này dành cho nam hay nữ</span>
								<a href="#" class="gender-product-upload selected" id="womenGender">Nữ</a>
								<a href="#" class="gender-product-upload" id="menGender">Nam</a>
							</div>
							
							<div class="product-upload-action">
								<input type="submit" value="Đăng lên Wewant" class="product-upload-action-btn">
							</div>

						</form>
					</div>
				</div>
			</div>
		</div>
			<!-- jquery de handle event select vao option khac, mac dinh se la bo suu tap dau tien -->
			<script type="text/javascript">
				$( document ).ready(function() {

					var popup_menu = 'hide';
					$(".products-selected-collection-container").on("click",function(){
						if(popup_menu == 'hide'){
							$(".products-collection-dropdown .dropdown-menu").show();
							popup_menu = 'show';
						} else if(popup_menu == 'show') {
							$(".products-collection-dropdown .dropdown-menu").hide();
							popup_menu = 'hide';
						}
					});

					//close pop up, set value cho hidden input collection-id
					
					$(".products-collections a").on("click",function(){

						var dataIdCollection = $(this).parent().data("id-collection");


						if(dataIdCollection == -1){
							
							// neu colection duoc chon la collection moi vua tao thi data-id-collection = null
							// nen val cua collection se la text cua collection moi tao
							
							$("input#id_collection").val('$(this).text()');
						} else {
							//neu collection duoc chon trong list la collection da tao tu truoc
							//thi lay gia tri data-id-collection de luu vao input hidden id_collection

							$("input#id_collection").val(dataIdCollection);
							$("#collection_is_new").val('false');
						}
						//luu text cua collection trong list vao input selected collection
						$(".products-selected-collection-container span").text($(this).text());

						//an popup
						$(".products-collection-dropdown .dropdown-menu").hide();
						popup_menu = 'hide';

					});

					// tat popup menu khi clic vao nut close, set status popup_menu = hide;
					$(".close-dropdown-menu").click(function(){
						if(popup_menu == 'show'){
							$(".products-collection-dropdown .dropdown-menu").hide();
							popup_menu = 'hide';
						}

					})

					$(".add-new-collection-container button").click(function(){
						var newCollectionName = $("input.add-new-collection-name").val();
						$("#collection_is_new").val('true');
						$("input#id_collection").val(newCollectionName);
						$(".products-selected-collection-container span").text(newCollectionName);
						$("form#upload_new_product").append("<input name='newCollection[]' type='hidden' value='"+newCollectionName+"'>");
						$(".dropdown-menu ul.products-collections").append("<li data-id-collection='-1' ><a href='#'>"+newCollectionName+"</a></li>");
						//xoa val hien tai cua input sau khi da tao collection moi xong
						$("input.add-new-collection-name").val('');
						$(".products-collection-dropdown .dropdown-menu").hide();

						popup_menu = 'hide';
					});

					//handle click chon category cho san pham upload
					//click the a, lay data-category-id
					$(".theme-category-dropdown-menu li ul li a").click(function(){
						$(".category-product-upload-container input").val($(this).attr("data-category-id"));
						$(".category-product-button a.category-product-selected span").text($(this).text());
						$(".category-product-button .category-dropdown-menu").hide();
						setTimeout(function(){$(".category-dropdown-menu").removeAttr("style");},10);
						return false;
					});

					//handle click chon genderProduct (nam hay nu) input vao genderProduct
					$("#uploadGenderProduct #menGender").on("click",function(){
						$(this).addClass("selected");
						$("#uploadGenderProduct #womenGender").removeClass("selected");
						$( "input[name='genderProduct']" ).val(1);
					});
					$("#uploadGenderProduct #womenGender").on("click",function(){
						$(this).addClass("selected");
						$("#uploadGenderProduct #menGender").removeClass("selected");
						$( "input[name='genderProduct']" ).val(0);
					});

				});
			</script>
		</div>

<?php	
		} else {
			$url = $_GET['urlOfSite'];
			//ham tra ve chuoi Src va title cua tat ca Img
			//[0] => title cua spham, cac offset tu 1 tro di chua src
			$infoImgs = getImgInfo($url);
			echo "<div style='margin: 100px auto;'>";
			echo "<p style:'margin: 30px auto;'>$infoImgs[0]</p>";
			echo "</div>";
			echo "<div class=''>";

				//loop xuat ra the img cua tat ca cac img get duoc tu site
					for($i=1;$i<count($infoImgs);$i++){
						echo "<a href='getImage.php?ws={$_GET['urlOfSite']}&is={$infoImgs[$i]}&ti={$infoImgs[0]}'>";
						echo "<img src='{$infoImgs[$i]}' style='margin: 10px;'/>";
						echo "</a>";
					}
			echo "</div>";
		}
?>
</body>
</html>

